/*
 * @Descripttion:
 * @version:
 * @Author: yuanliutech
 * @Date: 2022-11-30 09:18:04
 * @LastEditors: yuanliutech@lwj
 * @LastEditTime: 2022-12-02 17:01:18
 */
// const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin; //查看打包大小工具
let path = require("path");

function resolve(dir) {
  return path.join(__dirname, dir);
}
module.exports = {
  // publicPath: './',
  // 输出文件目录
  outputDir: "dist",
  lintOnSave: false,
  productionSourceMap: false, //打包之后不生成map文件  // 生产环境是否生成 sourceMap 文件，一般情况不建议打开
  // devServer: {
  //     host: '192.168.1.106',
  //     port: '8080',
  // },
  // devServer: {
  //     open: true, //是否自动弹出浏览器页面
  //     host: '192.168.1.106',
  //     port: '',
  //     https: false,
  //     hotOnly: false,
  //     overlay: {
  //         warnings: false,
  //         errors: false
  //     },
  // },
  // css: {
  //     loaderOptions: {
  //         postcss: {
  //             plugins: [
  //                 require('postcss-pxtorem')({
  //                     rootValue: 192,
  //                     selectorBlackList: [],
  //                     propList: ['*'],
  //                 }),
  //             ],
  //         },
  //     },
  // },
  chainWebpack: (config) => {
    // svg图标加载
    config.module
      .rule("svg")
      .exclude.add(path.join(__dirname, "src/assets/icons/svg"))
      .end();

    config.module
      .rule("icons") // 定义一个名叫 icons 的规则
      .test(/\.svg$/) // 设置 icons 的匹配正则
      .include.add(path.join(__dirname, "src/assets/icons/svg")) // 设置当前规则的作用目录，只在当前目录下才执行当前规则
      .end()
      .use("svg-sprite") // 指定一个名叫 svg-sprite 的 loader 配置
      .loader("svg-sprite-loader") // 该配置使用 svg-sprite-loader 作为处理 loader
      .options({
        // 该 svg-sprite-loader 的配置
        symbolId: "icon-[name]",
      })
      .end();
    // svg图标加载结束

    config.when(process.env.NODE_ENV === "production", (config) => {
      config.entry("app").clear().add("./src/prod_env.js");
    });
    config.when(process.env.NODE_ENV === "test", (config) => {
      config.entry("app").clear().add("./src/test_env.js");
    });
    config.when(process.env.NODE_ENV === "development", (config) => {
      config.entry("app").clear().add("./src/dev_env.js");
    });
    config.optimization.minimize(true); //进行代码压缩
    config.resolve.alias
      .set("@", resolve("src"))
      .set("@assets", resolve("src/assets"))
      .set("@api", resolve("src/api"))
      .set("@theme", resolve("src/theme"))
      .set("@utils", resolve("src/utils"))
      .set("@router", resolve("src/router/index"))
      .set("@components", resolve("src/components"))
      .set("@views", resolve("src/views"))
      .set("@mixin", resolve("src/mixin"))
      .set("@plugins", resolve("src/plugins"))
      .set("@store", resolve("src/store"));
  },
  configureWebpack: (config) => {
    // 查看打包大小工具
    // plugins: [
    //     new BundleAnalyzerPlugin()
    // ]
    // 启用CDN加速 跟index.html对应着
    config.externals = {
      // 'vue': 'Vue',
      // 'vue-router': 'VueRouter',
      // 'element-ui': 'ElementUI',
      // 'axios': 'axios',
      // 'xlsx': 'XLSX',
      // 'BMap': 'BMap',
      // 'element-ui': 'ELEMENT',
    };
    // 为生产环境修改配置...
    if (
      process.env.NODE_ENV === "production" ||
      process.env.NODE_ENV === "test"
    ) {
      config.mode = "production";
      // 打包文件大小配置
      (config.performance = {
        maxEntrypointSize: 10000000,
        maxAssetSize: 30000000,
      }),
        // 开启分离js
        (config.optimization = {
          runtimeChunk: "single",
          splitChunks: {
            chunks: "all",
            maxInitialRequests: Infinity,
            minSize: 20000,
            cacheGroups: {
              vendor: {
                test: /[\\/]node_modules[\\/]/,
                name(module) {
                  // get the name. E.g. node_modules/packageName/not/this/part.js
                  // or node_modules/packageName
                  const packageName = module.context.match(
                    /[\\/]node_modules[\\/](.*?)([\\/]|$)/
                  )[1];
                  // npm package names are URL-safe, but some servers don't like @ symbols
                  return `npm.${packageName.replace("@", "")}`;
                },
              },
            },
          },
        });
    }
  },
  devServer: {
    // host: '127.0.0.1', // 本地地址
    // port: 1320, // 端口号
    // open: true, // 配置项目在启动时自动在浏览器打开
    // proxy: {
    //     '/api': { // '/api'是代理标识，一般是每个接口前的相同部分
    //         target: "http://192.168.1.106:1320/", // 请求地址，一般是服务器地址
    //         changeOrigin: true, // 是否进行跨域
    //         pathRewrite: { // pathRewrite的作用是把请求接口中的 '/api'替换掉，一般是替换为空""
    //             '^/api': ""
    //         }
    //     }
    // }
  },
  // configureWebpack: {
  //     // 查看打包大小工具
  //     plugins: [
  //         new BundleAnalyzerPlugin()
  //     ],
  //     externals: {
  //         'vue': 'Vue',
  //         'vue-router': 'VueRouter',
  //         // 'element-ui': 'ElementUI',
  //         'axios': 'axios',
  //     }
  // },
  // externals: {
  //     'vue': 'Vue',
  //     'element-ui': 'ElementUI',
  //     'axios': 'axios',
  // },
  pluginOptions: {
    "style-resources-loader": {
      preProcessor: "less",
      patterns: [
        // 这个是加上自己的路径,不能使用(如下:alias)中配置的别名路径
        path.resolve(__dirname, "./src/theme/style.less"),
      ],
    },
  },
};
